<template>
	<div>
		<!-- 软件资料维护 -->
		<v-card>
			<v-card-text>
				<v-row>
					<v-col cols="12" md="7">
						<v-card>
							<v-card-text>
								<v-alert text color="blue-grey">项目设备信息</v-alert>
								<v-container row class="text-subtitle-1 d-flex justify-center  align-left">
									<v-btn class="ml-2 mt-2" tile color="primary" @click="editProcessingClick">
										选择项目设备
									</v-btn>
									<v-divider class="mx-4" inset vertical></v-divider>
									<v-text-field v-model="bomTreeSearch" append-icon="mdi-magnify"
										label="输入BOM名称或编码或项目号搜索BOM信息,不输入字符默认搜索所有" single-line hide-details
										@keypress.enter="GetBomTree">
									</v-text-field>
								</v-container>
								<v-treeview selectable item-disabled="locked" v-model="selectionBomTrees"
									:items="bomTrees" item-key="id" @input="selectTreeEvent" return-object open-all
									dense>
									<template v-slot:append="{ item, open }">
										<v-tooltip top v-if="item.model.bomtype==1">
											<template v-slot:activator="{ on, attrs }">
												<v-icon v-bind="attrs" v-on="on" class="ml-2" small tile color="primary"
													@click="editBomChildrenDialog=true,bomChildrenModel={}, bomChildrenModel.parent=item.model">
													mdi-plus-thick
												</v-icon>
											</template>
											<span>新增软件</span>
										</v-tooltip>
										<v-tooltip top v-if="item.model.bomtype!=1">
											<template v-slot:activator="{ on, attrs }">
												<v-icon v-bind="attrs" v-on="on" class="ml-2" small tile color="success"
													@click="updateBomClick(item.model)">
													mdi-pencil
												</v-icon>
											</template>
											<span>编辑</span>
										</v-tooltip>
										<v-tooltip top v-if="item.model.bomtype==1">
											<template v-slot:activator="{ on, attrs }">
												<v-icon v-bind="attrs" v-on="on" class="ml-2" small tile color="warning"
													@click="submitAudit(item.model)">
													mdi-account-arrow-up
												</v-icon>
											</template>
											<span>提交审核</span>
										</v-tooltip>
										<v-tooltip top v-if="item.model.type==1">
											<template v-slot:activator="{ on, attrs }">
												<v-icon  v-bind="attrs" v-on="on"
													class="ml-2" small tile color="red"
													@click="deleteBomClick(item.model)">
													mdi-delete
												</v-icon>
											</template>
											<span>删除</span>
										</v-tooltip>
									</template>

								</v-treeview>
								<v-row justify="center">
									<v-col cols="12">
										<v-container class="max-width">
											<!-- total-visible:最大可见分页数 -->
											<!-- prev-icon:是用其它图片做上一页的按钮 -->
											<!-- next-icon:是用其它图片做下一页的按钮 -->
											<!-- circle:分页的按钮都是圆的 -->

											<v-pagination v-model="treePage.pageNumber" class="my-4"
												:length="treePage.totalPages" :total-visible="7"
												prev-icon="mdi-menu-left" next-icon="mdi-menu-right" circle
												@input="changeTreePage">
											</v-pagination>

										</v-container>
									</v-col>
								</v-row>
							</v-card-text>
							<v-alert border="right" justify="center" color="blue-grey" dark>
								项目设备总数：{{treePage.totalRecords}}
							</v-alert>
						</v-card>
					</v-col>
					<v-col cols="12" md="5">
						<v-card>
							<!-- 	<v-card-title>
								<v-btn class="ml-2 mt-1" small tile color="primary" @click="editProcessingClick">
									选择项目设备
								</v-btn>
								<v-divider class="mx-4" inset vertical></v-divider>
								<v-row class="mt-2">
									<v-col cols="2" sm="3" md="2">
										<v-text-field label="bom编码" v-model="bomQuery.code" dense outlined>
										</v-text-field>
									</v-col>
									<v-col cols="2" sm="3" md="2">
										<v-text-field label="bom名称" v-model="bomQuery.name" dense outlined>
										</v-text-field>
									</v-col>


									<v-col cols="12" sm="3" md="2">
										<v-select label="状态" v-model="bomQuery.bomstatus" :items="bomStatusItems" dense
											outlined>
										</v-select>
									</v-col>
									<v-col cols="12" sm="3" md="2">
										<v-select label="类型" v-model="bomQuery.bomtype" :items="bomTypeItems" dense
											outlined>
										</v-select>
									</v-col>

									<v-col cols="12" sm="2" md="2">
										<v-row>
											<v-col cols="12" md="6">
												<v-btn depressed color="primary" @click="loadPages">查询
												</v-btn>
											</v-col>
											<v-col cols="12" md="6">
												<v-btn class="ml-3" depressed color="primary" @click="refreshLoadPages">
													刷新</v-btn>
											</v-col>
										</v-row>
									</v-col>
								</v-row>
							</v-card-title> -->

							<v-card-text>
								<v-alert text color="blue-grey">项目设备BOM详细信息</v-alert>
								<v-data-table :headers="bomHeaderList" :items="bomDataList" small fixed-header
									item-key="id" dense show-select class="text-no-wrap" loading-text="正在加载请稍等......"
									:loading="bomLoading" :options.sync="bomOptions" :footer-props="vuetifyDefaultPage"
									:server-items-length="bomTotalCount">
									<template v-slot:item.actions="{ item }">
										<div>
											<v-btn v-if="item.bomtype==1" class="ml-2" small tile color="primary"
												@click="editBomChildrenDialog=true,bomChildrenModel={}, bomChildrenModel.parent=item">
												添加软件
											</v-btn>
											<v-btn v-if="item.bomtype!=1" class="ml-2" small tile color="primary"
												@click="updateBomClick(item)">
												修改
											</v-btn>
											<v-btn v-if="item.bomtype==1" class="ml-2" small tile color="warning"
												@click="submitAudit(item)">
												提交审核
											</v-btn>
											<v-btn class="ml-2" small tile color="red" @click="deleteBomClick(item)">
												删除
											</v-btn>
										</div>
									</template>
									<template v-slot:item.picurl="{ item }">
										<a @click="openLookPicsClick(item.picurl)">查看资料</a>
									</template>
								</v-data-table>
							</v-card-text>
						</v-card>
					</v-col>
				</v-row>
			</v-card-text>
		</v-card>
		<v-dialog v-model="editBomChildrenDialog" width="1200">
			<v-card>
				<v-card-title>维护项目设备软件</v-card-title>
				<v-card-text>
					<v-row>
						<v-col cols="12" md="4">
							<v-text-field label="软件编码(自动生成)" disabled v-model="bomChildrenModel.jgcode" dense outlined>
							</v-text-field>
						</v-col>
						<v-col cols="12" md="4" v-if="bomChildrenModel.parent!=null">

							<v-text-field v-if="bomChildrenModel.id>0" label="上级节点(必填)"
								v-model="bomChildrenModel.tempparentname" disabled dense outlined>
							</v-text-field>
							<v-text-field v-else label="上级节点(必填)" v-model="bomChildrenModel.parent.name" disabled dense
								outlined>
							</v-text-field>
						</v-col>
						<v-col cols="12" md="4" v-if="bomChildrenModel.parent!=null">
							<v-text-field v-if="bomChildrenModel.id>0" label="上级节点类型(必填)"
								v-model="bomChildrenModel.tempbomtypename" disabled dense outlined>
							</v-text-field>
							<v-text-field v-else label="上级节点类型(必填)" v-model="bomChildrenModel.parent.bomtypename"
								disabled dense outlined>
							</v-text-field>
						</v-col>
						<v-col cols="12" md="3">
							<v-text-field label="软件名称(必填)" v-model="bomChildrenModel.name" dense outlined>
							</v-text-field>
						</v-col>
						<v-col cols="12" md="3">
							<v-menu v-model="needDateMenu" :close-on-content-click="false" :nudge-right="40"
								transition="scale-transition" offset-y min-width="auto">
								<template v-slot:activator="{ on, attrs }">
									<v-text-field required v-model="bomChildrenModel.assemblydate" label="软件需求日期"
										readonly v-bind="attrs" v-on="on" outlined dense>
									</v-text-field>
								</template>
								<v-date-picker locale="zh-cn" v-model="bomChildrenModel.assemblydate"
									@input="needDateMenu = false">
								</v-date-picker>
							</v-menu>
						</v-col>
						<v-col cols="12" md="3">
							<v-select label="类型(必填)" v-model="bomChildrenModel.bomtype=2" disabled
								:items="modelUseBomTypeItems.filter(r=>r.value!=1)" dense outlined>
							</v-select>
						</v-col>
						<v-col cols="12" md="3">
							<v-select label="子类型(必填)" v-model="bomChildrenModel.bomchildrentype=6" disabled
								:items="workOrderTypeItems" dense outlined>
							</v-select>
						</v-col>
						<v-col cols="12" md="6">
							<v-text-field label="软件责任人" v-model="bomChildrenModel.responsiblename" dense outlined>
							</v-text-field>
						</v-col>
						<v-col cols="12" md="6">
							<v-text-field label="软件参与人员" v-model="bomChildrenModel.participantsname" dense outlined>
							</v-text-field>
						</v-col>

						<v-col cols="12">
							<uploadfile :UpLoad="UpLoadChildrenBomPic" :callBackPath="UpLoadChildrenBomPicCallBackPath">
							</uploadfile>
						</v-col>
					</v-row>
				</v-card-text>
				<v-card-actions>
					<v-spacer></v-spacer>
					<v-btn color="success" class="mr-4" text @click="bomhildrenSubmit">确认</v-btn>
					<v-btn color="warning" class="mr-4" text @click="bomhildrenClose">取消</v-btn>
				</v-card-actions>
			</v-card>
		</v-dialog>

		<projectequi :equiModel="equiModel" :callBack="setSelectProjectEquiCallBack"></projectequi>
		<showfiledialogcomment :filesModel="fileDialogComment"></showfiledialogcomment>
	</div>

</template>

<script>
	import {
		mapActions
	} from 'vuex'
	import showfiledialogcomment from '../../comments/ShowFilesDialog.vue'
	import uploadfile from '../../mes/components/UploadFile.vue'
	import load_project_equi from '../components/ProjectEquiDataList.vue'
	export default {
		name: 'edit_electrical_info',
		components: {
			uploadfile,
			showfiledialogcomment,
			projectequi: load_project_equi,
		},
		data: () => ({

			NeedQtyRule: [
				v => /^[0-9]*$/.test(v) || '请输入合法数字',
				v => v > 0 || '需求量不能小于0'
			],
			bomQuery: {
				name: '',
				code: '',
				bomtype: 1,
				bomstatus: 1,
			},
			enums: ['BomStatus', 'BomType', 'WorkOrderType'],
			bomStatusItems: [],
			bomTypeItems: [],
			workOrderTypeItems: [],
			modelUseBomTypeItems: [],
			bomHeaderList: [],
			bomDataList: [],
			bomTotalCount: 0,
			bomLoading: true,
			bomOptions: { //页数
				page: 1,
				//每页行数
				itemsPerPage: 10
			},
			vuetifyDefaultPage: {
				'items-per-page-text': '每页个数',
				'items-per-page-options': [10, 20, 50, 100]
				// 'items-per-page-all-text': '100'
			},
			bomTreeSearch: '',
			selectionBomTrees: [],
			bomTrees: [],
			assemblydateMenu: false,
			buymaterialdateMenu: false,
			needDateMenu: false,

			UpLoadChildrenBomPic: {
				isUploadSingleImage: false,
				isUploadMultipleFiles: true,
				type: 40
			},
			//子BOM
			editBomChildrenDialog: false,
			bomChildrenModel: {},

			treePage: {
				totalPages: 0,
				pageNumber: 1,
				pageSize: 10,
				totalRecords: 0
			},
			equiModel: {
				dialog: false,
				url: ``
			},
			fileDialogComment: {
				dialog: false,
				files: []
			}
		}),
		watch: {
			bomOptions: {
				handler() {
					this.loadPages()
				},
				deep: true
			},
		},
		created() {
			this.getHeaderList()
			this.loadEnums()
			this.changeTreePage(1)
		},
		methods: {
			...mapActions('mes/common', [
				//获取物料信息
				'LoadType'
			]),
			//查看图片
			openLookPicsClick(pathstrs) {
				this.fileDialogComment.dialog = true
				this.fileDialogComment.files = JSON.parse(pathstrs)

			},
			async loadEnums() {
				var items = await this.LoadType({
					pramterEnums: this.enums
				})
				this.bomStatusItems = items.filter(r => r.enumName == this.enums[0])
				this.bomTypeItems = items.filter(r => r.enumName == this.enums[1])
				this.modelUseBomTypeItems = items.filter(r => r.enumName == this.enums[1])
				this.workOrderTypeItems = items.filter(r => r.enumName == this.enums[2])
			},
			async changeTreePage(pageNumber) {
				this.treePage.pageNumber = pageNumber
				await this.GetBomTree()
			},
			async GetBomTree() {
				var response = await this.$httpRequest({
					url: `PDM/PDMDataSoftware/GetBomTree?isOpenLock=false&equiName_parName_projectName_projectCode=${this.bomTreeSearch}&type=6&pageNumber=${this.treePage.pageNumber}&pageSize=${this.treePage.pageSize}`,
					method: 'post'
				})

				if (response.status == 1) {
					this.bomTrees = response.data.trees
					this.treePage.totalPages = response.data.pagination.totalPages
					this.treePage.totalRecords = response.data.pagination.totalRecords
				} else {
					this.$message.error(response.info)
				}
			},
			async loadPages(keypaths = []) {
				this.bomLoading = true
				var response = await this.$httpRequest({
					url: `PDM/PDMDataSoftware/LoadPage?code=${this.bomQuery.code}&name=${this.bomQuery.name}&bomstatus=${this.bomQuery.bomstatus}&bomtype=${this.bomQuery.bomtype}&type=1&pageNumber=${this.bomOptions.page}&pageSize=${this.bomOptions.itemsPerPage}`,
					method: 'post',
					data: keypaths
				})
				if (response.status == 1) {
					this.bomDataList = response.data.result
					this.bomTotalCount = response.data.pagination.totalRecords
					this.bomLoading = false
				} else {
					this.$message.error(response.info)
				}
			},
			async refreshLoadPages() {
				this.bomQuery.name = ''
				this.bomQuery.code = ''
				this.bomQuery.bomtype = null
				this.bomQuery.bomstatus = null

			},
			selectTreeEvent(tree) {

				if (tree != null && tree.length > 0) {
					var keypaths = tree.map(r => r.keypath)
					this.refreshLoadPages()
					this.loadPages(keypaths)
				}
			},
			//新增下级节点
			addNextNodel(item) {
				this.editBomChildrenDialog = true
				this.bomChildrenModel = {}
				this.bomChildrenModel.parent = item
				//设备
				if (item.bomtype == 1) {
					this.modelUseBomTypeItems = this.modelUseBomTypeItems.filter(r => r.value == 2)
				} else {
					this.modelUseBomTypeItems = this.bomTypeItems
				}
			},
			//编辑 bom设备、部件对话框
			updateBomClick(item) {
				this.editBomChildrenDialog = true
				this.bomChildrenModel = item
				this.bomChildrenModel.tempbomtypename = this.bomChildrenModel.bomtypename
				this.bomChildrenModel.tempparentname = this.bomChildrenModel.parentname
			},

			//删除BOM
			async deleteBomClick(item) {
				var response = await this.$httpRequest({
					url: `PDM/PDMDataSoftware/DeleteBom?keypath=${item.keypath}`,
					method: 'delete'
				})
				if (response.status == 1) {
					this.$message.success(response.info)
					await this.loadPages()
					await this.GetBomTree()
				} else {
					this.$message.error(response.info)
				}
			},

			async bomFatherSubmit() {
				var url;
				if (this.bomFatherModel.id > 0) {
					url = `PDM/PDMDataSoftware/UpdateBom`
				} else {
					url = `PDM/PDMDataSoftware/AddBom`
				}
				this.bomFatherModel.bomtype = 1
				var response = await this.$httpRequest({
					url: url,
					method: 'post',
					data: this.bomFatherModel
				})
				if (response.status == 1) {
					this.$message.success(response.info)
					this.bomFatherClose()
					await this.loadPages()
					await this.GetBomTree()
				} else {
					this.$message.error(response.info)
				}
			},
			bomFatherClose() {
				this.bomFatherModel = {}
				this.editFatherDialog = false
			},
			UpLoadFatherBomPicCallBackPath(fileUrlItemJson) {
				this.bomFatherModel.picurl = JSON.stringify(fileUrlItemJson)
			},
			async bomhildrenSubmit() {
				var url;

				if (this.bomChildrenModel.id > 0) {
					url = `PDM/PDMDataSoftware/UpdateBom`
				} else {
					url = `PDM/PDMDataSoftware/AddBom`
				}

				var response = await this.$httpRequest({
					url: url,
					method: 'post',
					data: this.bomChildrenModel
				})
				if (response.status == 1) {
					this.$message.success(response.info)
					this.bomhildrenClose()
					await this.loadPages()
					await this.GetBomTree()
				} else {
					this.$message.error(response.info)
				}
			},
			bomhildrenClose() {
				this.bomChildrenModel = {}
				this.editBomChildrenDialog = false
			},
			UpLoadChildrenBomPicCallBackPath(fileUrlItemJson) {
				this.bomChildrenModel.picurl = JSON.stringify(fileUrlItemJson)
			},

			//加工件-添加部件零件信息页面
			editProcessingClick() {
				this.equiModel.dialog = true
				this.equiModel.url = `PDM/PDMDataSoftware/LoadProjectEquiPage?iscreatesoftware=false&`
			},
			//选择项目设备的回调函数
			async setSelectProjectEquiCallBack(selectEquiModel, equiDataHeaderList) {
				var response = await this.$httpRequest({
					url: `PDM/PDMDataSoftware/GenerateMechanicalData?projectEquiId=${selectEquiModel.id}&type=6`,
					method: 'get',
				})
				if (response.status == 1) {
					this.changeTreePage(1)
					this.loadPages()
					this.$message.success('BOM结构生成成功！')
				} else {
					this.$message.error(response.info)
				}
			},
			//提交审核
			async submitAudit(item) {
				var response = await this.$httpRequest({
					url: `PDM/PDMDataSoftware/SubmitAudit?keypath=${item.keypath}&workOrderType=6`,
					method: 'get'
				})
				if (response.status == 1) {
					this.$message.success(response.info)
				} else {
					this.$message.error(response.info)
				}

			},

			//选择外购件的供应商的回调函数
			setSelectSupplierCallBack(supplier) {
				this.inventoryModel = supplier
				this.bomChildrenModel.suppliercode = supplier.cVenCode
				this.bomChildrenModel.suppliername = supplier.cVenName
			},
			getHeaderList() {
				this.bomHeaderList = [{
						text: '操作',
						align: 'center',
						value: 'actions',
						filterable: false,
						class: 'fixed'
					},
					{
						text: '名称',
						align: 'left',
						value: 'name',
						filterable: false,
						class: 'fixed'
					},
					{
						text: 'BOM类型',
						align: 'left',
						value: 'bomtypename',
						filterable: false,
						class: 'fixed'
					},
					{
						text: 'BOM子类型',
						align: 'left',
						value: 'bomchildrentypename',
						filterable: false,
						class: 'fixed'
					},
					{
						text: '结构',
						align: 'left',
						value: 'keypathname',
						filterable: false,
						class: 'fixed'
					},
					{
						text: '项目名称',
						align: 'left',
						value: 'project.citemname',
						filterable: false,
						class: 'fixed'
					},
					{
						text: '项目号',
						align: 'left',
						value: 'project.citemcode',
						filterable: false,
						class: 'fixed'
					},
					{
						text: '查看资料',
						align: 'left',
						value: 'picurl',
						filterable: false,
						class: 'fixed'
					},

					{
						text: '审批状态',
						align: 'center',
						value: 'approval.approvalstatusname',
						filterable: false,
						class: 'fixed'
					},
					{
						text: '审批人回复',
						align: 'left',
						value: 'approval.approvaldescription',
						filterable: false,
						class: 'fixed'
					},
				]
			},
		}
	}
</script>
